import React from 'react';
import { View, Text, StyleSheet } from 'react-native';

/**
 * 统计卡片组件
 */
const StatisticsCard = ({ label, value, rate, onPress }) => {
  return (
    <View style={styles.container}>
      <Text style={styles.label}>{label}</Text>
      <Text style={styles.value}>{value}</Text>
      {rate !== undefined && (
        <Text style={styles.rate}>完成率: {rate}%</Text>
      )}
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    backgroundColor: '#FFFFFF',
    borderRadius: 12,
    padding: 16,
    marginBottom: 12,
  },
  label: {
    fontSize: 14,
    color: '#8E8E93',
    marginBottom: 8,
  },
  value: {
    fontSize: 32,
    fontWeight: 'bold',
    color: '#007AFF',
    marginBottom: 4,
  },
  rate: {
    fontSize: 14,
    color: '#8E8E93',
  },
});

export default StatisticsCard;

